<template>
   <view class="mord">
		<view class="h1">
			欢迎注册云上营家
		</view>
		<view class="input">
			<view class="li">
				<image src="../../static/img/3/3-10.png" mode="widthFix"></image>
				<view class="x"></view>
				<input class="min" type="number" v-model="val" placeholder="请输入手机号" />
				<view class="right">
					<view class="b" @click="del">
						<image src="../../static/img/3/3-11.png" mode="widthFix"></image>
					</view>
				</view>
			</view>
			<view class="p">
				新注册的手机号验证后自动创建云上营家账户
			</view>
			
		</view>
		<view class="next" @click="next">
			获取短信验证码
		</view>
   </view>
</template>

<script>
	
    export default {
        name: "",
        components:{
            
        },
        data(){
            return {
                val:''
            }
        },
		methods:{
			del(){
				this.val=''
			},
			next(){
				var that = this;
				// uni.navigateTo({
				//     url: '/pages/login/res_b'
				// })
				that.$Request.post(
					that.$api.httpApi.login.register,
					{"phone":that.val,'countryCode':''},
					).then(res=>{
						if(res.code == 200){
							
						}else{
							uni.showToast({
								title:res.message,
								icon:'none'
							})
						}
					})
			}
		}

    }
</script>

<style scoped>
	.next{
		display: block;
		width:75%;
		margin: auto;
		height:98rpx;
		background:rgba(240,64,111,1);
		border-radius:49rpx;
		font-size:30rpx;
		font-family:PingFang SC;
		font-weight:500;
		color:rgba(255,255,255,1);
		text-align: center;
		line-height: 98rpx;
		margin-top: 77rpx;
	}
	.h1{
		font-size:48rpx;
		font-family:PingFang SC;
		font-weight:500;
		color:rgba(0,0,0,1);
		text-align: center;
		padding-top: 100rpx;
	}
	.input {
		width: 75%;
		margin: auto;
		/* margin-top: 100rpx; */
	}
	
	.input .p {
		text-align: right;
		font-size: 28rpx;
		color: #B7B7B7;
	}
	
	.input .li {
		border-bottom: 1px solid #CECECE;
		padding-bottom: 12rpx;
		margin-bottom: 45rpx;
		margin-top: 72rpx;
	}
	
	.input .li image {
		width: 26rpx;
		display: inline-block;
		vertical-align: middle;
	}
	
	.input .li input {
		display: inline-block;
		width: calc(100% - 90rpx);
		vertical-align: middle;
		margin-left: 21rpx;
		font-size: 30rpx;
		color: #B7B7B7;
		font-weight: normal;
	}
	
	.input .li .min {
		width: calc(100% - 130rpx);
	}
	
	.input .li .right {
		width: calc(100% - 480rpx - 45rpx);
		margin-left: 16rpx;
		display: inline-block;
		vertical-align: middle;
	}
	
	.input .li .right .b {
		display: inline-block;
		width: 40rpx;
		text-align: center;
	
	}
	
	.input .li .right .b image {
		display: inline-block;
		width: 100%;
		vertical-align: middle;
	}
	
	.input .li .x {
		display: inline-block;
		vertical-align: middle;
		width: 1px;
		height: 30rpx;
		background: #E5E5E5;
		margin-left: 25rpx;
	}
	
	.input .li .right .but {
		font-size: 26rpx;
		width: calc(100% - 65rpx - 16rpx - 15rpx);
		margin-left: 25rpx;
		display: inline-block;
		vertical-align: middle;
		color: #8F8F94;
	}
	.input  .p{
		font-size:26rpx;
		font-family:PingFang SC;
		font-weight:500;
		color:rgba(162,162,162,1);
		margin-top: 44rpx;
		text-align: left;
	}
</style>
